<template>
  <div class="eject" @click="hideEject">
    <ul class="clearfix">
      <li>
        <img src="http://file.rzkeji.com/web/recruit/icon/banner1.png"/>
        <div>返回首页</div>
      </li>
      <li>
        <img src="http://file.rzkeji.com/web/recruit/icon/banner1.png"/>
        <div>返回首页</div>
      </li>
      <li>
        <img src="http://file.rzkeji.com/web/recruit/icon/banner1.png"/>
        <div>返回首页</div>
      </li>
      <li>
        <img src="http://file.rzkeji.com/web/recruit/icon/banner1.png"/>
        <div>返回首页</div>
      </li>
      <li>
        <img src="http://file.rzkeji.com/web/recruit/icon/banner1.png"/>
        <div>返回首页</div>
      </li>
      <li>
        <img src="http://file.rzkeji.com/web/recruit/icon/banner1.png"/>
        <div>返回首页</div>
      </li>
      <li>
        <img src="http://file.rzkeji.com/web/recruit/icon/banner1.png"/>
        <div>返回首页</div>
      </li>
      <li>
        <img src="http://file.rzkeji.com/web/recruit/icon/banner1.png"/>
        <div>返回首页</div>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
	data () {
    return {

    }
  },
  computed:{
    
  },
  methods:{
    hideEject(){
      this.$store.dispatch('setEject',false)
    }
  }
}
</script>

<style scoped>
.eject{position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 100;background-color: rgba(0,0,0,0.3);animation: dong 2s;padding-bottom: 200px;}
.eject ul{height: 200px;background-color: #fff;padding: 20px;width: 335px;}
ul li{float: left;width: 80px;height: 100px;}
ul li img{width: 40px;height: 40px;margin-left: 20px;margin-top: 20px;}
ul li div{text-align: center;font-size: 12.5px;line-height: 20px;width: 100%;}

@keyframes dong{
  0%{transform: translateY(-200px);}
  100%{transform: translateY(0);background-color: rgba(0,0,0,0.3);}
}
</style>
